<html>
<head>
<title>SWT/JFace Data Binding Example</title>
<meta content="text/html; charset=windows-1252" http-equiv="Content-Type">
<link href="../../../../book.css" rel="stylesheet" type="text/css">
</head>
<body bgcolor="#FFFFFF">
    <h1>SWT/JFace Data Binding Example</h1>
	<h3>Supported for Eclipse 3.3 
	and above only</h3>
	<table border="0" width="600" cellspacing="0" cellpadding="0">
		<tr>
			<td valign="top">As an example of how the the data binding tools can be 
	used, consider the following <b>Phone Book</b> example. The phone book 
	manages a set of phone groups. Each phone group in turn holds onto one or 
	more persons. For each person, various e-mail and phone contact information 
	is maintained. Editing a person's description should update the same data 
	shown in the list. The final code for the <b>Phone Book</b> project is available
	<a href="DataBindingTest.zip">here</a>. <br><i><b>Note: In Eclipse 3.5, </b> you need to add the following plugins to your classpath:<b>
	org.eclipse.core.databinding.property.* 
	and org.eclipse.core.databinding.observable.*</i></b><br> </td><b>
	</b><b></b><b>
			</b><b>
		</b></tr><b>
	</b></table><b>
	</b><ol><b>
		</b><li><b>
		</b><p class="pnoall"><b>Use Designer to create the skeleton of the </b><b>
		PhoneBook.java</b><b> class</b><b><br></b><b>
		</b><b><br></b><b>
		</b><b><img border="0" src="images/example1.gif"></b><b><br></b><b>
&nbsp;</b></li><b>
		</b><li><b>
		</b><p class="pnoall"><b>Create the following model classes:</b></li><b>
	</b></ol><b>
	</b><blockquote><b>
		</b><ul><b>
			</b><li><b>
			</b><p class="pnoall"><b>Class </b><b>Person</b><b> with properties: </b><b>name</b><b>,
			</b><b>email</b><b>, </b><b>phone</b><b>, </b><b>mobilePhone1</b><b>, </b><b>mobilePhone2</b></li><b>
			</b><li><b>
			</b><p class="pnoall"><b>Class </b><b>PhoneGroup</b><b> with properties: </b><b>name</b><b>,
			</b><b>persons</b></li><b>
			</b><li><b>
			</b><p class="pnoall"><b>Class </b><b>PhoneGroups</b><b> with properties: </b><b>
			groups</b></li><b>
		</b></ul><b>
	</b></blockquote><b>
	</b><ol><b>
		</b><li value="3"><b>
		</b><p class="pnoall"><b>Add the following to the </b><b>PhoneBook</b><b> class:</b><b><br></b><b>
		</b><b><br></b><b>
		</b><font face="Courier" size="2"><b>&nbsp;&nbsp;&nbsp; private PhoneGroups 
		m_groups = new PhoneGroups();</b><b><br></b><b>
		</b></font><b><br></b><b>
		And add some initial data:</b><b><br></b><b>
		</b><b><br></b><b>
		</b><font face="Courier" size="2"><b>&nbsp;&nbsp;&nbsp; PhoneGroup group1 = new 
		PhoneGroup(&quot;Developer Team&quot;);</b><b><br></b><b>
&nbsp;&nbsp;&nbsp; m_groups.addGroup(group1);</b><b><br></b><b>
&nbsp;&nbsp;&nbsp; group1.addPerson(new Person(&quot;Konstantin Scheglov&quot;, 
		&quot;kosta@nospam.com&quot;, &quot;1234567890&quot;, &quot;&quot;, &quot;&quot;));</b><b><br></b><b>
&nbsp;&nbsp;&nbsp; group1.addPerson(new Person(&quot;Alexander Mitin&quot;, 
		&quot;mitin@nospam.com&quot;, &quot;&quot;, &quot;0987654321&quot;, &quot;&quot;));</b><b><br></b><b>
&nbsp;&nbsp;&nbsp; group1.addPerson(new Person(&quot;Alexander Lobas&quot;, 
		&quot;lobas@nospam.com&quot;, &quot;&quot;, &quot;&quot;, &quot;111-222-333-00&quot;));</b><b><br></b><b>
&nbsp;</b></font></li><b>
		</b><li><b>
		</b><p class="pnoall"><b>Set the content for the group viewer. Click the
	</b><b>Bindings</b><b> tab in the editor. Select </b><b>m_groupViewer</b><b> in the 
		</b><b>Targets (Widgets)</b><b> 
		list, </b><b>input</b><b> in the </b><b>Target Properties</b><b> list, select </b><b>m_groups</b><b> in the </b><b>
		<img border="0" src="images/data_binding_beans_button.gif" align="absbottom"> 
		Model (Beans) </b><b>list, and </b><b>groups</b><b> in the </b><b>Model Properties</b><b> list.
	</b><p class="pnoall"><b>
	</b><b><img border="0" src="../../../wizards/databinding/images/data_binding_tab.gif" align="absbottom"></b><b><br></b><b>
	</b><b><br></b><b><img border="0" src="images/example2.gif"></b><b><br></b><b>&nbsp;</b></p></li><b>
		</b><li><b>
		</b><p class="pnoall"><b>Click the
	</b><b><img border="0" src="images/binding_button.gif" width="26" height="24" align="absbottom"></b><b>
	</b><b>Bind</b><b> button to open the </b><b>Create Data Binding</b><b> dialog. </b><b>m_groups.group</b><b> 
		contains elements of type </b><b>PhoneGroup</b><b>, so select the type </b><b>
		PhoneGroup</b><b> and its </b><b>name</b><b> property.</b><b><br></b><b>
		</b><b><br></b><b>
		</b><b><img border="0" src="images/example3.gif"></b><b>&nbsp;</b><b><img border="0" src="images/example4.gif"></b><b><br></b><b>
&nbsp;</b></li><b>
		</b><li><b>
		</b><p class="pnoall"><b>Click </b><b>OK</b><b> to see </b><b>m_groups.groups</b><b> bound to
		</b><b>m_groupsViewer</b><b> in the table.</b><b><br></b><b>
		</b><b><br></b><b>
		</b><b><img border="0" src="images/example5.gif"></b><b><br></b><b>
&nbsp;</b></li><b>
		</b><li><b>
		</b><p class="pnoall"><b>Run the application to see that the list of phone 
		groups is populated.</b><b><br></b><b>
		</b><b><br></b><b>
		</b><b><img border="0" src="images/example6.gif"></b><b><br></b><b>
&nbsp;</b></li><b>
		</b><li><b>
		</b><p class="pnoall"><b>Next we would like selecting a group to show all of 
		its contained persons. Switch back to the
	</b><b>Bindings</b><b> tab. 
		Select the </b><b>input</b><b> of the </b><b>m_personViewer</b><b> in the </b><b>Target 
		Widget</b><b> list and </b><b>
		m_groupViewer</b><b> and </b><b>part of selection</b><b> in the </b><b>Model Widget</b><b> list and click the
	</b><b><img border="0" src="images/binding_button.gif" width="26" height="24" align="absbottom"></b><b>
	</b><b>Bind</b><b> button to open the </b><b>Create Data Binding</b><b> dialog.</b><b><br></b><b>
		</b><b><br></b><b>
		</b><b><img border="0" src="images/example7.gif" align="top"></b><b>
		</b><b><img border="0" src="images/example7a.gif"></b><b><br></b><b>
&nbsp;</b></li><b>
		</b><li><b>
		</b><p class="pnoall"><b>The selection type of </b><b>m_groupViewer</b><b> is a </b><b>
		PhoneGroup</b><b> bean, so select it in the </b><b>Master Bean class </b><b>list. The 
		Properties list then shows all of the properties that can be 
		used for input to </b><b>m_peopleViewer</b><b>. Select the property </b><b>persons</b><b> 
		as it contains elements of the type </b><b>Person</b><b>.</b><b><br></b><b>
		</b><b><br></b><b>
		</b><b><img border="0" src="images/example8.gif"></b><b><br></b><b>
&nbsp;</b></li><b>
		</b><li><b>
		</b><p class="pnoall"><b>We need to show a </b><b>Person</b><b> object in </b><b>
		m_personViewer</b><b>, so select the class </b><b>Person</b><b> in the </b><b>Element 
		bean class</b><b> 
		list (use the &quot;...&quot; button to add it to the list, if necessary). Select and order the </b><b>Person</b><b> properties that should be 
		shown in the table</b><b><br></b><b>
		</b><b><br></b><b>
		</b><b><img border="0" src="images/example9.gif"></b><b>&nbsp;</b><b><img border="0" src="images/example10.gif"></b><b><br></b><b>
&nbsp;</b></li><b>
		</b><li><b>
		</b><p class="pnoall"><b>Click </b><b>OK</b><b> twice and run the application. See 
		that selecting a group now updates the </b><b>Persons</b><b> list.</b><b><br></b><b>
		</b><b><br></b><b>
		</b><b><img border="0" src="images/example11.gif"></b><b><br></b><b>
&nbsp;</b></li><b>
		</b><li><b>
		</b><p class="pnoall"><b>&nbsp;Switch back to the
	</b><b>Bindings</b><b> tab. Next we need to bind </b><b>part of selection</b><b> of the </b><b>m_personViewer</b><b> (a 
		Person object) into the various text editors.</b><b><br></b><b>
		</b><b><br></b><b>
		</b><b><img border="0" src="images/example12.gif"></b><b><br></b><b>
&nbsp;</b></li><b>
		</b><li><b>
		</b><p class="pnoall"><b>Select the first </b><b>Text</b><b> widget (</b><b>m_nameText</b><b>) 
		and its </b><b>text</b><b> property. Click the
	</b><b><img border="0" src="images/binding_button.gif" width="26" height="24" align="absbottom"></b><b>
	</b><b>Bind</b><b> button to open the </b><b>Bind Properties</b><b> dialog. Leave the 
		update value strategies unchanged. Since each </b><b>Text</b><b> field is bound 
		to a different property of of the selection, choose the appropriate property from the </b><b>
		Properties</b><b> list (</b><b>name</b><b> for the</b><b> m_nameText </b><b>text field).</b><b><br></b><b>
		</b><b><br></b><b>
		</b><b><img border="0" src="images/example13.gif"></b><b><br></b><b>
&nbsp;</b></li><b>
		</b><li><b>
		</b><p class="pnoall"><b>Bind each </b><b>selection</b><b> property to its associated
		</b><b>Text</b><b> field.</b><b><br></b><b>
		</b><b><br></b><b>
		</b><b><img border="0" src="images/example14.gif"></b><b><br></b><b>
&nbsp;</b></li><b>
		</b><li><b>
		</b><p class="pnoall"><b>Run the application. See that selecting a 
		group updates the </b><b>Persons</b><b> list and selecting a </b><b>Person</b><b> now 
		updates each of the </b><b>Text</b><b> fields.</b><b><br></b><b>
		</b><b><br></b><b>
		</b><b><img border="0" src="images/example15.gif"></b><b><br></b><b>
&nbsp;</b></li><b>
		</b><li><b>
		</b><p class="pnoall"><b>Also note that changing any of the data in the text 
		fields immediately updates the data in the table. </b><b>The magic of data 
		binding!</b><b><br></b><b>
		</b><b><br></b><b>
		</b><b><img border="0" src="images/example16.gif"></b></li><b>
	</b></ol><b>
	      </b></body><b>
</b></html>